{% extends 'admin/common/base.html' %}
{% block body %}
<body class="gray-bg">
    <div class="container-div">
		<div class="row">
			<div class="col-sm-12 search-collapse">
				<form id="menu-form">
					<div class="select-list">
						<ul>
							<li>
								菜单名称：<input type="text" name="name"/>
							</li>
							<li>
								菜单状态：<select name="visible">
									<option value="">所有</option>
									<option value="0">显示</option>
									<option value="1">隐藏</option>
								</select>
							</li>
							<li>
								<a class="btn btn-primary btn-rounded btn-sm" onclick="$.treeTable.search()"><i class="fa fa-search"></i>&nbsp;搜索</a>
								<a class="btn btn-warning btn-rounded btn-sm" onclick="$.form.reset()"><i class="fa fa-refresh"></i>&nbsp;重置</a>
							</li>
						</ul>
					</div>
				</form>
			</div>
                
            <div class="btn-group-sm" id="toolbar" role="group">
		        <a class="btn btn-success {{check_perms('sys:menu:add')}}" onclick="$.operate.add(0)">
                    <i class="fa fa-plus"></i> 新增
                </a>
                <a class="btn btn-primary {{check_perms('sys:menu:edit')}}" onclick="$.operate.edit()">
		            <i class="fa fa-edit"></i> 修改
		        </a>
                <a class="btn btn-info" id="expandAllBtn">
                    <i class="fa fa-exchange"></i> 展开/折叠
                </a>
	        </div>
       		 <div class="col-sm-12 select-table table-striped">
	            <table id="bootstrap-tree-table"></table>
	        </div>
	    </div>
	</div>
</body>
{% endblock %}
{% block js %}
{{ super() }}
<script>
    var addFlag = "";
    var editFlag = "";
    var removeFlag = "";
    var datas = [{"searchValue":null,"createBy":"admin","createTime":"2020-12-14 10:59:25","updateBy":null,"updateTime":null,"remark":"\u663E\u793A\u83DC\u5355","params":{},"dictCode":4,"dictSort":1,"dictLabel":"\u663E\u793A","dictValue":"0","dictType":"sys_show_hide","cssClass":"","listClass":"primary","isDefault":"Y","status":"0","default":true},{"searchValue":null,"createBy":"admin","createTime":"2020-12-14 10:59:25","updateBy":null,"updateTime":null,"remark":"\u9690\u85CF\u83DC\u5355","params":{},"dictCode":5,"dictSort":2,"dictLabel":"\u9690\u85CF","dictValue":"1","dictType":"sys_show_hide","cssClass":"","listClass":"danger","isDefault":"N","status":"0","default":false}];
    var prefix = "system/menu";
    var addFlag = "{{check_perms('sys:menu:add')}}";
    var editFlag = "{{check_perms('sys:menu:edit')}}";
    var removeFlag = "{{check_perms('sys:menu:remove')}}";

    $(function() {
        var options = {
            code: "id",
            parentCode: "parent_id",
            uniqueId: "id",
            expandAll: false,
            expandFirst: false,
            url: "{{url_for('admin.sys.menu.list')}}",
            createUrl: "{{url_for('admin.sys.menu.add')}}?parent_id={id}",
            updateUrl: "{{url_for('admin.sys.menu.edit')}}?id={id}",
            removeUrl: "{{url_for('admin.sys.menu.remove')}}?id={id}",
            modalName: "菜单",
            columns: [{
                field: 'selectItem', 
                radio: true
             },
             {
                title: '菜单名称',
                field: 'name',
                width: '20',
                widthUnit: '%',
                formatter: function(value, row, index) {
                    if ($.common.isEmpty(row.icon)) {
                        return row.name;
                    } else {
                        return '<i class="' + row.icon + '"></i> <span class="nav-label">' + row.name + '</span>';
                    }
                }
            },
            {
                field: 'order_num',
                title: '排序',
                width: '10',
                widthUnit: '%',
                align: "left"
            },
            {
                field: 'url',
                title: '请求地址',
                width: '15',
                widthUnit: '%',
                align: "left",
                formatter: function(value, row, index) {
                    return $.table.tooltip(value);
                }
            },
            {
                title: '类型',
                field: 'menu_type',
                width: '10',
                widthUnit: '%',
                align: "left",
                formatter: function(value, item, index) {
                    if (item.menu_type == 'M') {
                        return '<span class="label label-success">目录</span>';
                    }
                    else if (item.menu_type == 'C') {
                        return '<span class="label label-primary">菜单</span>';
                    }
                    else if (item.menu_type == 'F') {
                        return '<span class="label label-warning">按钮</span>';
                    }
                }
            },
            {
                field: 'visible',
                title: '可见',
                width: '10',
                widthUnit: '%',
                align: "left",
                formatter: function(value, row, index) {
                    if (row.menu_type == 'F') {
                        return '-';
                    }
                    if(value == '0') {
                        return '显示'
                    }else if(value == '1') {
                        return '隐藏'
                    }
                    return $.table.selectDictLabel(datas, row.visible);
                }
            },
            {
                field: 'perms',
                title: '权限标识',
                width: '15',
                widthUnit: '%',
                align: "left",
                formatter: function(value, row, index) {
                    return $.table.tooltip(value);
                }
            },
            {
                title: '操作',
                width: '20',
                widthUnit: '%',
                align: "left",
                formatter: function(value, row, index) {
                    var actions = [];
                    actions.push('<a class="btn btn-success btn-xs ' + editFlag + '" href="javascript:void(0)" onclick="$.operate.edit(\'' + row.id + '\')"><i class="fa fa-edit"></i>编辑</a> ');
                    actions.push('<a class="btn btn-info btn-xs ' + addFlag + '" href="javascript:void(0)" onclick="$.operate.add(\'' + row.id + '\')"><i class="fa fa-plus"></i>新增</a> ');
                    actions.push('<a class="btn btn-danger btn-xs ' + removeFlag + '" href="javascript:void(0)" onclick="$.operate.remove(\'' + row.id + '\')"><i class="fa fa-trash"></i>删除</a>');
                    return actions.join('');
                }
            }]
        };
        $.treeTable.init(options);
    });
</script>
{% endblock %}
